<template>
  <div>
    <div class="box">
      <div class="box-l" v-for="(v,i) in houdata" :key="i">
        <div class="jif">
          <h5>{{v.tit}}</h5>
          <p>{{v.con}}</p>
        </div>
        <img :src="v.img" alt />
      </div>
      <!-- <div class="box-l">
        <div class="jif">
          <h5>积分夺宝</h5>
          <p>小积分限时夺大奖</p>
        </div>
        <img src="@/assets/al_03.gif" alt />
      </div> -->
     
    </div>
  </div>
</template>
<script>
export default {
  props: ['houdata'],
};
</script>
<style scoped>
.box {
  display: flex;
  padding: 0 20px;
  justify-content: space-between;
  margin-bottom: 25px;
}
h5 {
  font-size: 14px;
}
.box p {
  font-size: 10px;
}
.box-l,
.box-r {
  width: 158px;
  height: 80px;
   display: flex;
   justify-content: space-evenly;
}
.box-l {
  background: #fff6ec;
}
.box-r {
  background: #fff3f2;
}
.jif,.ch{
    align-self: center;
}
.box-l img,
.box-r img{
    width: 48px;
    height: 48px;
    align-self: center;
}
</style>